<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Station Device Application</title>
	<link href="/public/css/device.css?version=1" rel="stylesheet" type="text/css" />
	<link href="/public/lib/adminlte/js/adminlte.min.js" rel="stylesheet" type="text/css" />
	<link href="/public/lib/adminlte/css/adminlte.min.css" rel="stylesheet" type="text/css" />
	<link href="/public/lib/bootstrap/4.6.1/css/bootstrap.css" rel="stylesheet">

	<script type="text/javascript" src="/ajax/libs/vue/2.7.10/vue.js"></script>
	<script src="/ajax/libs/axios/0.21.0/axios.min.js"></script>

	<script type="text/javascript" src="/ajax/libs/iview/3.5.0/iview.min.js"></script>
	<link rel="stylesheet" type="text/css" href="/ajax/libs/iview/3.5.0/styles/iview.css">

	<link href="/public/lib/ionicons/3.0.0/css/ionicons.css" rel="stylesheet">
	<link href="/ajax/libs/font-awesome/5.15.4/css/all.css" rel="stylesheet">
</head>
<body>
<div id="app" class="app-container" >
	<div class="kc-menu-fixed">
		<i-menu mode="horizontal" ref="menu" class="kc-menu"  :active-name="activeMenu">
			<menu-item v-for="menu in menus" :key="menu.name" :name="menu.name" :to="menu.url" >
				<i :class="menu.icon"></i>
				{{menu.title}}
			</menu-item>
		</i-menu>
	</div>
	<section class="content">
		<div class="container-fluid">
			<!-- Horizontal Form -->
			<div class="card" style="margin-top: 1rem">
				<div class="card-header">
					<h3 class="card-title"><i class="fas  fa-th-large"></i> {{ i18n["device.html.basic_config"]}}</h3>
					<div class="card-tools">
						<button type="button" class="btn btn-tool btn-outline-primary" style="margin-left: 1rem" @click="reload"> {{ i18n["device.html.refresh"]}}</button>
						<button type="button" class="btn btn-tool btn-outline-primary" style="margin-left: 1rem" @click="save"> {{ i18n["device.html.save"]}}</button>
					</div>
				</div>
				<!-- /.card-header -->
				<!-- form start -->

				<div class="card-body">
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.server_ip"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.hostIP">
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.warehouse_code"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.warehouseId">
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.language"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn btn-flat" :class="{'btn-outline-primary': (properties.language==='zh-CN') }" type="button" @click="changeLanguage('zh-CN')">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.language_cn"]}}
								</button>
								<button class="btn btn-flat" :class="{'btn-outline-primary': (properties.language==='en-US') }"  type="button" @click="changeLanguage('en-US')">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.language_en"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.force_specify_station"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn btn-flat" :class="{'btn-outline-primary': (properties.forceSpecifiedStation) }" type="button" @click="properties.forceSpecifiedStation=!properties.forceSpecifiedStation">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.yes"]}}
								</button>
								<button class="btn btn-flat" :class="{'btn-outline-primary': !(properties.forceSpecifiedStation) }"  type="button" @click="properties.forceSpecifiedStation=!properties.forceSpecifiedStation">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.no"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row" v-show="properties.forceSpecifiedStation">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.force_specify_station_code"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.forceSpecifiedStationCode">
						</div>
					</div>
				</div>
				<!-- /.card-body -->
			</div>

			<!-- general form elements -->
			<div class="card" style="margin-top: 1rem">
				<div class="card-header">
					<h3 class="card-title"> <i class="fas  fa-th-large"></i> {{ i18n["device.html.ptl"]}}</h3>
					<span class="badge" :class="{'badge-info': (ptl.success), 'badge-danger': !(ptl.success)}" style="margin-left: 1rem; font-size: 100%"><i class="far fa-clock"></i> {{ptl.message}}</span>
					<div class="card-tools">
						<button type="button" class="btn btn-tool btn-outline-dark" style="margin-left: 1rem" @click="testConnection('PTL',properties.devicePtlIP,properties.devicePtlPort)"> {{ i18n["device.html.test_connection"]}}</button>
						<button type="button" class="btn btn-tool btn-outline-primary" style="margin-left: 1rem" @click="save"> {{ i18n["device.html.save"]}}</button>
					</div>
				</div>
				<!-- /.card-header -->
				<!-- form start -->
				<div class="card-body">
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.is_enabled"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn btn-flat" :class="{'btn-outline-primary': (properties.devicePtlEnabled) }" type="button" @click="properties.devicePtlEnabled=!(properties.devicePtlEnabled);">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.yes"]}}
								</button>
								<button class="btn btn-flat" :class="{'btn-outline-primary': !(properties.devicePtlEnabled) }"  type="button" @click="properties.devicePtlEnabled=!(properties.devicePtlEnabled);">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.no"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.device_type"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn" :class="{ 'btn-default':!(properties.devicePtlImpl == 'DefaultLightDevice'), 'btn-outline-primary': (properties.devicePtlImpl == 'DefaultLightDevice') }" type="button" @click="changePtlDriver('DefaultLightDevice', false)">
									<em class="glyphicon glyphicon-align-left"></em> Default
								</button>
								<button class="btn " :class="{ 'btn-default':!(properties.devicePtlImpl == 'ABLEAT400LightDevice') , 'btn-outline-primary': (properties.devicePtlImpl == 'ABLEAT400LightDevice') }" type="button" @click="changePtlDriver('ABLEAT400LightDevice', true)">
									<em class="glyphicon glyphicon-align-center"></em> AT400
								</button>
								<button class="btn " :class="{ 'btn-default':!(properties.devicePtlImpl == 'ABLEAT500LightDevice') ,'btn-outline-primary': (properties.devicePtlImpl == 'ABLEAT500LightDevice') }" type="button" @click="changePtlDriver('ABLEAT500LightDevice', true)">
									<em class="glyphicon glyphicon-align-right"></em> AT500
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row" v-show="driverIpConfig">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.control_id"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.devicePtlControlID" >
						</div>
					</div>
					<div class="form-group row" v-show="driverIpConfig">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.control_ip"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.devicePtlIP" >
						</div>
					</div>
					<div class="form-group row" v-show="driverIpConfig">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.control_port"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.devicePtlPort" >
						</div>
					</div>
				</div>
				<!-- /.card-body -->
			</div>
			<!-- /.card -->

			<!-- general form elements -->
			<div class="card" style="margin-top: 1rem">
				<div class="card-header">
					<h3 class="card-title"> <i class="fas  fa-th-large"></i> {{ i18n["device.html.slant"]}}</h3>
					<span class="badge" :class="{'badge-info': (slant.success), 'badge-danger': !(slant.success)}" style="margin-left: 1rem; font-size: 100%"><i class="far fa-clock"></i> {{slant.message}}</span>
					<div class="card-tools">
						<button type="button" class="btn btn-tool btn-outline-dark" style="margin-left: 1rem" @click="testConnection('SLANT',properties.deviceSlantIP,properties.deviceSlantPort)"> {{ i18n["device.html.test_connection"]}}</button>
						<button type="button" class="btn btn-tool btn-outline-primary" style="margin-left: 1rem" @click="save"> {{ i18n["device.html.save"]}}</button>
					</div>
				</div>
				<!-- /.card-header -->
				<!-- form start -->
				<div class="card-body">
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.is_enabled"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn" :class="{'btn-outline-primary': (properties.deviceSlantEnabled) }" type="button" @click="properties.deviceSlantEnabled=!(properties.deviceSlantEnabled);">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.yes"]}}
								</button>
								<button class="btn" :class="{'btn-outline-primary': !(properties.deviceSlantEnabled) }"  type="button" @click="properties.deviceSlantEnabled=!(properties.deviceSlantEnabled);">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.no"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.ip"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.deviceSlantIP">
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.port"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.deviceSlantPort" />
						</div>
					</div>
				</div>
				<!-- /.card-body -->
			</div>
			<!-- /.card -->

			<!-- general form elements -->
			<div class="card" style="margin-top: 1rem">
				<div class="card-header">
					<h3 class="card-title"> <i class="fas  fa-th-large"></i> {{ i18n["device.html.camera"]}}</h3>
					<span class="badge" :class="{'badge-info': (camera.success), 'badge-danger': !(camera.success)}" style="margin-left: 1rem ; font-size: 100%"><i class="far fa-clock"></i> {{camera.message}}</span>
					<div class="card-tools">
							<button type="button" class="btn btn-tool btn-outline-primary" style="margin-left: 1rem" @click="save"> {{ i18n["device.html.save"]}}</button>
					</div>
				</div>

				<!-- /.card-header -->
				<!-- form start -->
				<div class="card-body">
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.is_enabled"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn" :class="{'btn-outline-primary': (properties.deviceCameraEnabled) }" type="button" @click="properties.deviceCameraEnabled=!(properties.deviceCameraEnabled);">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.yes"]}}
								</button>
								<button class="btn" :class="{'btn-outline-primary': !(properties.deviceCameraEnabled) }"  type="button" @click="properties.deviceCameraEnabled=!(properties.deviceCameraEnabled);">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.no"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.scan_timing"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn" :class="{'btn-outline-primary': (properties.deviceCameraScanBeforeEnter) }" type="button" @click="properties.deviceCameraScanBeforeEnter=!(properties.deviceCameraScanBeforeEnter);">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.scan_before_enter"]}}
								</button>
								<button class="btn" :class="{'btn-outline-primary': !(properties.deviceCameraScanBeforeEnter) }"  type="button" @click="properties.deviceCameraScanBeforeEnter=!(properties.deviceCameraScanBeforeEnter);">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.scan_after_enter"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.scan_direction"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn" :class="{'btn-outline-primary': (properties.deviceCameraDirection==='inner') }" type="button" @click="properties.deviceCameraDirection='inner'">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.scan_inner"]}}
								</button>
								<button class="btn" :class="{'btn-outline-primary': (properties.deviceCameraDirection==='outer') }"  type="button" @click="properties.deviceCameraDirection='outer'">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.scan_outer"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.connection_info"]}}</label>
						<div class="input-group col-sm-10">
							<table class="table table-bordered">
								<thead>
								<tr>
									<th style="width: 20%">{{ i18n["device.html.station"]}}</th>
									<th style="width: 15%">{{ i18n["device.html.point"]}}</th>
									<th style="width: 30%">{{ i18n["device.html.ip"]}}</th>
									<th style="width: 10%">{{ i18n["device.html.port"]}}</th>
									<th style="width: 25%">{{ i18n["device.html.operation"]}}</th>
								</tr>
								</thead>
								<tbody>
								<tr v-for="conn in properties.deviceCameraConnections">
									<td><input type="text" class="form-control" v-model="conn.station"></td>
									<td><input type="text" class="form-control" v-model="conn.point"></td>
									<td><input type="text" class="form-control" v-model="conn.ip"></td>
									<td><input type="text" class="form-control" v-model="conn.port"></td>
									<td>
										<button type="button" class="btn btn-outline-dark" style="margin-left: 1rem" @click="testConnection('CAMERA',conn.ip,conn.port)"> {{ i18n["device.html.test_connection"]}}</button>
										<button type="button" class="btn btn-outline-danger" style="margin-left: 1rem" @click="deleteCamera(conn)"> {{ i18n["device.html.delete"]}}</button>
									</td>
								</tr>
								</tbody>
							</table>
							<button type="button" class="btn btn-block btn-outline-primary" @click="addCamera">{{ i18n["device.html.add_camera"]}}</button>
						</div>
					</div>
				</div>
				<!-- /.card-body -->
			</div>
			<!-- /.card -->

			<!-- general form elements -->
			<div class="card" style="margin-top: 1rem">
				<div class="card-header">
					<h3 class="card-title"> <i class="fas  fa-th-large"></i> {{ i18n["device.html.container_strip"]}}</h3>
					<span class="badge" :class="{'badge-info': (strip.success), 'badge-danger': !(strip.success)}" style="margin-left: 1rem; font-size: 100%"><i class="far fa-clock"></i> {{strip.message}}</span>
					<div class="card-tools">
						<button type="button" class="btn btn-tool btn-outline-dark" style="margin-left: 1rem" @click="testConnection('STRIP',properties.deviceStripIP,properties.deviceStripPort)"> {{ i18n["device.html.test_connection"]}}</button>
						<button type="button" class="btn btn-tool btn-outline-primary" style="margin-left: 1rem" @click="save"> {{ i18n["device.html.save"]}}</button>
					</div>
				</div>
				<!-- /.card-header -->
				<!-- form start -->
				<div class="card-body">
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.is_enabled"]}}</label>
						<div class="input-group col-sm-10">
							<div class="btn-group">
								<button class="btn" :class="{'btn-outline-primary': (properties.deviceStripEnabled) }" type="button" @click="properties.deviceStripEnabled=!(properties.deviceStripEnabled);">
									<em class="glyphicon glyphicon-align-left"></em> {{ i18n["device.html.yes"]}}
								</button>
								<button class="btn" :class="{'btn-outline-primary': !(properties.deviceStripEnabled) }"  type="button" @click="properties.deviceStripEnabled=!(properties.deviceStripEnabled);">
									<em class="glyphicon glyphicon-align-center"></em> {{ i18n["device.html.no"]}}
								</button>
							</div>
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.ip"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.deviceStripIP">
						</div>
					</div>
					<div class="form-group row">
						<label for="inputEmail3" class="col-sm-2 col-form-label">{{ i18n["device.html.port"]}}</label>
						<div class="input-group col-sm-10">
							<input type="text" class="form-control" v-model="properties.deviceStripPort">
						</div>
					</div>
				</div>
				<!-- /.card-body -->
			</div>
			<!-- /.card -->

		</div>
	</section>
</div>
<script type="text/javascript">
    var app = new Vue({
        el: '#app',
		data () {
			return {
				i18n:{},
				activeMenu:'config',
				menus:[{
					name:'index',
					url:'/admin/device/index',
					icon:'fas fa-warehouse',
					title:'系统信息'
				},{
					name:'config',
					url:'/admin/device/config',
					icon:'fas fa-cogs',
					title:'设置'
				}],
				deviceUrl: "http://localhost:8888/station/device/code",
				deviceCode: "1231232",
				stationCode: "未绑定",
				ptl:{
					success:false,
					message:"connected"
				},
				slant:{
					success:true,
					message:"connected"
				},
				camera:{
					success:true,
					message:"connected"
				},
				strip:{
					success:false,
					message:"connected"
				},
				properties:{
					"hostIP": "172.31.214.50",
					"warehouseId": 1,
					"forceSpecifiedStation": true,
					"forceSpecifiedStationCode": "Station_1",

					"devicePtlEnabled": true,
					"devicePtlImpl": "DefaultLightDevice",
					"devicePtlQuantity": 100,
					"devicePtlIP": "127.0.0.1",
					"devicePtlPort": 5003,
					"devicePtlControlID": 1,

					"deviceSlantEnabled": true,
					"deviceSlantIP": "192.168.2.111",
					"deviceSlantPort": 2200,

					"deviceStripEnabled": true,
					"deviceStripIP": "10.0.50.100",
					"deviceStripPort": 4660,

					"deviceCameraEnabled": true,
					"deviceCameraModel": "TCP",
					"deviceCameraDirection": "inner",
					"deviceCameraScanBeforeEnter": false,
					"deviceCameraConnections": [
						{
							"station": "Station_1",
							"point": "187",
							"ip": "127.0.0.1",
							"port": 0
						},
						{
							"station": "Station_1",
							"point": "188",
							"ip": "172.31.214.50",
							"port": 0
						}
					],
					"localIP": "172.31.245.55"
				}
			}
		},
		computed: {
			driverIpConfig() {
				// 忽略大小写的比较
				return !(this.properties.devicePtlImpl=== 'DefaultLightDevice');
			}
		},
		mounted() {
			window.app = this;
			// 界面初始化信息
			this.getI18NResource();
			this.getMenus(this.activeMenu);
			// 界面数据初始化
			this.init();
		},
		methods: {
			init(){
				this.getDeviceProperties();
				this.getHardwareStates();
			},
			getI18NResource(){
				axios.get('/admin/i18n/mappings/default')
						.then(response => {
							let result = response.data
							this.i18n = result.data;
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
			},
			getMenus(activeMenu){
				axios.get('/admin/device/menus')
						.then(response => {
							if(!response.data.success){throw response.data.message;}
							let result = response.data
							this.menus = result.data;
							this.$nextTick(() => {
								this.$refs.menu.updateActiveName(activeMenu);
							});
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
			},
			reload(){
				window.location.reload();
			},
			refreshData(){
				this.getHardwareStates();
			},
			getDeviceProperties(){
				axios.get('/station/device/properties/get')
						.then(response => {
							let result = response.data
							this.properties = result.data;
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
			},
			changePtlDriver(driver){
				this.properties.devicePtlImpl = driver;
				if(this.properties.devicePtlImpl==='ABLEAT400LightDevice'){
					// 设定默认值
					this.properties.devicePtlIP = "10.0.50.100";
					this.properties.devicePtlPort = 4660;
				}
				if(this.properties.devicePtlImpl==='ABLEAT500LightDevice'){
					// 设定默认值
					this.properties.devicePtlIP = "10.0.50.100";
					this.properties.devicePtlPort = 5003;
				}
			},
			addCamera(){
				this.properties.deviceCameraConnections.push({port:6666});
			},
			deleteCamera(camera){
				this.properties.deviceCameraConnections = this.properties.deviceCameraConnections.filter(user =>
						JSON.stringify(user) !== JSON.stringify(camera)
				);
			},
			testConnection(deviceType,ip,port){
				this.$Message.success(this.i18n["device.error.SUCCESS"+ ":" + ip + ":" + port]);
			},
			save(){
				axios.post('/station/device/properties/save',this.properties)
						.then(response => {
							this.$Message.success(this.i18n["device.error.SUCCESS"]);
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
			},
			changeLanguage(language){
				this.properties.language = language;
				axios.get('/admin/i18n/language/change',{
					params: {language:this.properties.language}
				})
				.then(response => {
					// 刷新当前界面
					this.reload();
				})
				.catch(error => {
					this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
				});
			},
			listenServer(stationCode) {
				// 检查原生支持
				/*if (typeof EventSource === 'undefined') {
                    window.EventSource = window.EventSourcePolyfill;
                }*/

				// 现在可以正常使用 EventSource
				let url = '/station/refresh/sse?stationCode=' + stationCode;
				let eventSource = new EventSource(url);
				eventSource.onmessage = (event) => {
					console.log('SSE 数据:', event.data);
					this.refreshData();
				};
				eventSource.onerror = (error) => {
					console.error('连接错误:', error);
					// 自定义重连逻辑
					if (eventSource.readyState === EventSource.CLOSED) {
						console.log('尝试在 3 秒后重连...');
						setTimeout(connect, 3000);
					}
				};
			},
			getHardwareStates(){
				axios.get('/station/device/properties/getConnectResult/PTL')
						.then(response => {
							let result = response.data
							this.ptl = result;
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
				axios.get('/station/device/properties/getConnectResult/SLANT')
						.then(response => {
							let result = response.data
							this.slant = result;
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
				axios.get('/station/device/properties/getConnectResult/STRIP')
						.then(response => {
							let result = response.data
							this.strip = result;
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
				axios.get('/station/device/properties/getConnectResult/CAMERA')
						.then(response => {
							let result = response.data
							this.camera = result;
						})
						.catch(error => {
							this.$Message.error({content: this.i18n["device.error.FAIL"]+":"+error, duration: 3, closable: true});
						});
			}
		}
	});
	//app.use(ViewUIPlus);
	//app.mount("#app");

	function refreshData() {
		window.app.refreshData();
	}
</script>
</body>
</html>